/**
 * author: huangyu
 * Tips消息提示组件
 */
import React, { Component } from 'react';
import { Icon } from 'antd';
import './Tips.less';
export default class TipsChild extends Component {
    constructor(props) {
        super(props);
        this.state = {
            showAni: false
        };
    }
    componentDidMount() {
        let { show, cancleHandle, params } = this.props;
        this.setState({
            showAni: show
        });
        if (params.type !== 'loading') {
            setTimeout(() => {
                this.setState({
                    showAni: false
                }, () => {
                    setTimeout(() => {
                        let callBack = typeof params.callBack === 'function' ? params.callBack : () => { };
                        callBack();
                        cancleHandle();
                    }, 200);
                });
            }, 2000);
        } else {
            if (!params.isShow) {
                setTimeout(() => {
                    this.setState({
                        showAni: false
                    }, () => {
                        setTimeout(() => {
                            let callBack = typeof params.callBack === 'function' ? params.callBack : () => { };
                            callBack();
                            cancleHandle();
                        }, 200);
                    });
                }, 2000);
            }
        }
    }
    componentWillReceiveProps(nextProps) {
        // console.log('nexpor', nextProps);
    }
    
    componentWillUnmount() {
        // 重写组件的setState方法，直接返回空
        this.setState = (state, callback) => {
            return;
        };
    }
    render() {
        let { params } = this.props;
        let { showAni } = this.state;
        let icon = params.type === 'success' ? 'check-circle' :
            params.type === 'loading' ? 'loading' :
                params.type === 'fail' ? 'close-circle' :
                    params.type === 'warning' ? 'exclamation-circle' : '';
        return (
            <div >
                <div className={`tips-container ${showAni ? 'animate' : 'leave'}`}>
                    <div className={`${params.type} tips-content`}>
                        <Icon className={`${params.type}-icon tips-icon`} type={icon} />
                        <span>{params.message}</span>
                    </div>
                </div>
            </div>
        );
    }
}
